<template>
  <div class="qa-wrappper">
    <div class="qa" v-for="(d, i) in qadata" :key="i">
         <div class="title" v-show="d.type === 'title'">{{d.title}}</div>
         <template v-if="d.type==='title'">
            <template v-for="(c, j) in d.children">
              <qa-item-disabled :d="c" :key="j" ></qa-item-disabled>
            </template>
         </template>
         <template v-else>
           <qa-item-disabled :d="d" :key="i"></qa-item-disabled>
         </template>
    </div>
   
  </div>
</template>

<script>
// import {formatDate} from '../common/js/util'
import QaItemDisabled from './QaItemDisabled'

export default {
  props: ['qadata'],
  components: {QaItemDisabled}
}
</script>

<style lang="less">
@import '../common/css/vars.less';
.qa-login {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
  }
.qa {
  border-bottom: 1px solid @color-border;
  border-top: 3px solid @color-primary;
  background:#fff;
  margin-bottom: 1em;
  padding: 10px;
  .title {
    color:#999;
    padding-bottom: 1em;
  }
  .mu-text-field-input {
    border: 1px solid #eee;
    padding: 0 10px;
  }
  .qa-label {
    height: 18px;
    width: 40px;
    display: inline-block;
    color: #fff;
    font-size: 12px;
    padding-left: 8px;
    &.qa-label-radio{
      background-image: url(../assets/tab_单选@2x.png);
      background-size: cover;
    }
    &.qa-label-checkbox {
      background-image: url(../assets/tab_多选@2x.png);
      background-size: cover;
    }
    &.qa-label-input {
      background-image: url(../assets/tab_填空@2x.png);
      background-size: cover;
    }
  }
  .qa-content {
    padding-top: 10px;
    
  }
}
</style>
